<!DOCTYPE html>
<html lang="zh-CN">

<head>

    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=no">

    <title>22 - 滑动切换注册登录页面</title>

    <link rel="stylesheet" href="./css/index.css">
    <!-- <script  src="./js/index.js"></script> -->

</head>

<body>

    <div class="container">
        <div class="form-box">
            <div class="register-box hidden">
                <h1>register</h1>
                <input type="text" placeholder="用户名">
                <input type="email" placeholder="邮箱">
                <input type="password" placeholder="密码">
                <input type="password" placeholder="确认密码">
                <button>注册</button>
            </div>
            <div class="login-box">
                <h1>login</h1>
                <input type="text" placeholder="用户名">
                <input type="password" placeholder="密码">
                <button>登录</button>
            </div>
        </div>
        <div class="con-box left">
            <h2>欢迎来到<span>TIZI</span></h2>
            <p>快来领取您的专属<span>礼品</span></p>
            <img src="./images/ds1.jpg" alt="">
            <p>已有账号</p>
            <button id="login">去登录</button>
        </div>
        <div class="con-box right">
            <h2>欢迎来到<span>TIZI</span></h2>
            <p>快来看看您的收藏<span>礼品</span></p>
            <img src="./images/ds2.jpg" alt="">
            <p>没有账号？</p>
            <button id="register">去注册</button>
        </div>
    </div>


    <script src="./js/index.js"></script>
</body>


</html>